var React = require('react');
import { Component } from 'react-native';

import {
    ScrollView,
    StyleSheet,
    Image,
    Text,
    View
} from 'react-native';

import {styles} from '../common/style';
import { HeadApp, MenuApp, SliderView , LoadingView } from './HeadMenu';
import Icon from 'react-native-vector-icons/Foundation';

var Travelurl = "http://www.yidianzixun.com/api/q/?cstart=0&cend=20&fields=title&fields=image&fields=source&fields=date&fields=comment_count&fields=like&fields=is_like&fields=image_urls&t=1464350545772&fields=url&infinite=true&path=channel|news-list-for-best-channel";

console.log(Travelurl)


var TravelView = React.createClass({

    getInitialState: function(){
        return {
            travelitem: []
        }
    },

    componentDidMount: function(){
        return this.fetchData()
    },

    fetchData: function(){

        fetch(Travelurl)
            .then(response => response.json())
            .then(response =>{
                console.log(response);
                var data = response.data
                this.setState({
                    TravelView: data
                })
            })
    },


    TravelItemView: function(){

        return this.state.travelitem.map(function(item, key){
            return (
                <View style={[styles.travelBox, styles.Row]} key={key}>
                    <Text>aaaa</Text>
                </View>
            )
        })

    },

    render: function(){
        return (
            <View style={[styles.content]}>

                <HeadApp></HeadApp>

                <View style={[styles.container]} >
                    <ScrollView>
                        <View>
                            {
                                this.TravelItemView() || []
                            }
                        </View>

                    </ScrollView>
                </View>

                <MenuApp></MenuApp>
            </View>

        )
    },

});

module.exports = {
    TravelView: TravelView
}
